/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
var report = {
    init: function() {
        this.addEventListers();

        var report_id = $('#report_id').val();
        if (report_id != '0') {
            //edit mode
            this.getDetails();
        }
        var pathname = window.location.pathname;
        if(pathname == "/user_view/report" ){
             workspace_functions.view_save(".save_workspace");
        }
    },
    addEventListers: function() {
        var self = this;
        this.selectForm();
        // this.selectAllParameters();
        //this.deselectAllParameters();
        this.selectAllColumns();
        this.deselectAllColumns();
        this.sortColumns();
        this.save();

        this.appendParameter();
        this.deleteParameter();


        $('body').on('click', '#column_group_categorized', function() {
            $('#column_sort_ascending').click();
        });

        $('body').on('click', '[action="add_column"]', function() {
            self.setColumnProperties();
        });

        $('body').on('click', '[action="add_plot_bond"]', function() {
            self.setChartPlotBand();
        });

        $('body').on('click', '.reportPlotBandOK', function() {
            var rowIndex = $(this).attr('row-index');
            var name = $('#report_plotName').val();
            var fromType = $('[name="report_chartPlotBand_from"]:checked').val();
            var from = $('#report_plotFromValue').val();
            var toType = $('[name="report_chartPlotBand_to"]:checked').val();
            var to = $('#report_plotToValue').val();
            var color = $('#report_plotColor').val();


            if (name == '') {
                showNotification({
                    message: "Please fill-up Name",
                    type: "error",
                    autoClose: true,
                    duration: 3
                });
                return;

            }

            if (from == '') {
                showNotification({
                    message: "Please fill-up From Value",
                    type: "error",
                    autoClose: true,
                    duration: 3
                });
                return;

            }

            if (to == '') {
                showNotification({
                    message: "Please fill-up To Value",
                    type: "error",
                    autoClose: true,
                    duration: 3
                });
                return;

            }

            
            if(color==""){
                color = "#ECC";
            }
            if (rowIndex) {
                var tr = $('#report_chartPlotBands tr').eq(rowIndex);


                console.log($(tr).find('td').eq(0));
                $(tr).find('td').eq(0).html(name);
                $(tr).find('td').eq(1).html(fromType);
                $(tr).find('td').eq(2).html(from);
                $(tr).find('td').eq(3).html(toType);
                $(tr).find('td').eq(4).html(to);
                $(tr).find('td').eq(5).css('background-color', color);
            } else {
                $('#report_chartPlotBands').append('<tr class="tr_plot_bands"><td>' + name + '</td><td>' + fromType + '</td><td>' + from + '</td><td>' + toType + '</td><td>' + to + '</td><td style="background-color:' + color + '"></td><td style="text-align:center"><div class="icon-trash fa fa-trash-o cursor deletePlotBands" style="margin-left: auto;margin-right: auto" data-type="deactivate" data-user-id="1"></div></td></tr>');
            }

            $('#popup_cancel').click();
        });
        $('body').on('click', '.reportColumnOK', function() {
            var columnName = $('#report_columnName').val();
            var columnValueType = $('[name="report_defaultValueType"]:checked').val();
            var columnValue = $('#report_columnValue').val();
            var columnIndex = $(this).attr('column-index');
            var columnSort = $('[name="report_column_sort"]:checked').val();
            var columnGroup = $('[name="report_column_grouping"]:checked').val();
            var columnWidth = $('#report_columnWidth').val();
            var columnType = $('#report_columnType').val();
            var columnShowTotal = $('#column_show_total').prop('checked');
            var columnShowAverage = $('#column_show_average').prop('checked');

            if (columnName == "") {
                showNotification({
                    message: "Please fill-up Name",
                    type: "error",
                    autoClose: true,
                    duration: 3
                });
                return;
            }

            if (columnValue == "") {
                showNotification({
                    message: "Please fill-up Value",
                    type: "error",
                    autoClose: true,
                    duration: 3
                });
                return;
            }

            if (columnWidth == "") {
                showNotification({
                    message: "Please fill-up Width.",
                    type: "error",
                    autoClose: true,
                    duration: 3
                });
                return;
            }

            if (columnIndex) {
                var th = $('.sortableRow th').eq(columnIndex);

                console.log(th);
                $(th).html(columnName + '<div style="float:right"><i class="icon-remove delete_column"></i></div>');
                $(th).attr('value-type', columnValueType);
                $(th).attr('value', columnValue);
                $(th).attr('sort', columnSort);
                $(th).attr('group', columnGroup);
                $(th).attr('format', columnType);
                $(th).attr('show-total', columnShowTotal);
                $(th).attr('show-average', columnShowAverage);
            } else {
                $('.sortableRow').append('<th class="report_sorting_disabled" style="background: #EDEDED !important;" value-type="' + columnValueType +
                        '" value="' + columnValue +
                        '" format="' + columnType +
                        '" show-total="' + columnShowTotal +
                        '" show-average="' + columnShowAverage +
                        '" sort="' + columnSort +
                        '" group="' + columnGroup + '">' +
                        columnName +
                        '<div style="float:right"><i class="icon-remove delete_column"></i></div></th>');
            }

            self.setHeaderResizable();

            $('#popup_cancel').click();

        });

        $('body').on('click', '.delete_column', function() {
            $(this).closest('th').remove();
        });

        $('body').on('click', '.deletePlotBands', function() {
            $(this).closest('tr').remove();
        });

        $('body').on('dblclick', '.report_sorting_disabled', function() {
            self.setColumnProperties($(this));
        });

        $('body').on('dblclick', '.tr_plot_bands', function() {
            self.setChartPlotBand($(this));
        });

        $('body').on('change', '#report_columnType', function() {
            console.log('selected format', $(this).val());

            if ($(this).val() == 'Text') {
                $('.addDetails').hide();
            } else {
                $('.addDetails').show();
            }
        });
    },
    selectForm: function() {
        var form_id = $("#form_id").val();
        if (!form_id) {
            this.getForms(function(data) {
               var newDialog = new jDialog(data, "", "", "", "", function() {
                });
               newDialog.themeDialog("modal2");
                //select form
                $(".getFormForWorkflow").click(function() {
                    var value = $(".forms_selection").val();
                    if (value != 0) {
                        var user_view = $('#user_url_view').val();
                        var pathName = window.location.pathname;

                        if (pathName == user_view + 'report') {
                            window.location = user_view + "report?id=0&form_id=" + value;
                        } else {
                            window.location = "/report?id=0&form_id=" + value;
                        }

                        $("#popup_overlay,#popup_container").remove();
                    } else {
                        showNotification({
                            message: "Please choose a form to proceed.",
                            type: "error",
                            autoClose: true,
                            duration: 3
                        });
                    }

                })
            })
        }
    },
    getForms: function(callback) {
        //var form_id = $(".form_chosen").val();
        $.post("/ajax/getFormProperties", {
            action: "getForm"
        }, function(forms) {
            var forms_json = JSON.parse(forms);
            var ret = "";
            ret += '<div style="float:left;width:50%;">';
            ret += '<h3 class="fl-get-report pull-left fl-margin-bottom">';
            ret += '<i class="icon-asterisk"></i> ' + "Get Report";
            ret += '</h3>';
            ret += '</div>';
            //ret += '<div style="float:right;width:50%;text-align:right;margin-top:-5px;">';
            //    ret += '<input type="button" class="btn-basicBtn getFormForWorkflow" id="" value="Ok" node-data-id="" style="">';
            //ret += '</div>';
            ret += '<div class="hr"></div>';
            ret += '<div class="fields">';
            ret += '<div class="label_below2"> Please select a form: </div>';
            ret += '<div class="input_position">';
            ret += '<select class="form-select forms_selection fl-margin-bottom" style="margin-top:5px; margin-bottom:5px;">';
            ret += '<option value="0">----------------------------Select----------------------------</option>';
            for (var i in forms_json) {

                ret += '<option value="' + forms_json[i]['form_id'] + '">' + forms_json[i]['form_name'] + '</option> ';
            }
            ret += '</select>';
            ret += '</div>';
            ret += '</div>';
            ret += '<div class="fields">';
            ret += '<div class="label_basic"></div>';
            ret += '<div class="input_position" style="margin-top:5px;text-align:right;">';
            ret += '<input type="button" class="btn-blueBtn getFormForWorkflow fl-margin-right fl-margin-bottom" value="Ok"> ';
            //ret += '<a href="/"><input type="button" class="btn-basicBtn  fl-margin-right fl-margin-bottom" id="workflow-cancel" value="Cancel"></a>';
            ret += '</div>';
            ret += '</div>';
            callback(ret);
        })
    },
    appendParameter: function() {
        $('body').on('click', '[action="append_parameter"]', function() {
            parameters.append();
        });
    },
    deleteParameter: function() {
        $('body').on('click', '.deleteParameter', function() {
            parameters.remove(this);
        });
    },
    selectAllParameters: function() {
        $('body').on('click', '[action="selectall_parameters"]', function() {
            $('[data-type="field-parameter"]').each(function() {
                $(this).attr('checked', true)
            });
        });
    },
    deselectAllParameters: function() {
        $('body').on('click', '[action="deselectall_parameters"]', function() {
            $('[data-type="field-parameter"]').each(function() {
                $(this).attr('checked', false)
            });
        });
    },
    selectAllColumns: function() {
        $('body').on('click', '[action="selectall_columns"]', function() {
            $('[data-type="field-column"]').each(function() {
                $(this).attr('checked', true)
            });
        });
    },
    deselectAllColumns: function() {
        $('body').on('click', '[action="deselectall_columns"]', function() {
            $('[data-type="field-column"]').each(function() {
                $(this).attr('checked', false)
            });
        });
    },
    sortColumns: function() {
        $('.sortableRow').sortable();
    },
    save: function() {
        $('body').on('click', '.save_form_workspace', function() {
            var form_id = $("#form_id").val();
            var title = $('#workspace_title').val();
            var description = $('#workspace_description').val();
            if (title == "") {
                showNotification({
                    message: "Please indicate report title",
                    type: "error",
                    autoClose: true,
                    duration: 3
                });
                return;
            }
            var parameters = new Array();
            var columns = new Array();
            var plotBands = [];
            var yAxisMax = $('#yAxisMax').val();
            var yAxisMin = $('#yAxisMin').val();
            var yAxisInterval = $('#yAxisInterval').val();
            var report_id = $('#report_id').val();

            //            $('[data-type="field-parameter"]:checked').each(function(){
            //                parameters.push($(this).val());
            //            });

            $('[data-type="tr_parameters"]').each(function() {

                var column = $(this).find('[column="label"]')[0].value;
                var field = $(this).find('[column="field"]')[0].value;
                var operator = $(this).find('[column="operator"]')[0].value;

                var row_parameter = {
                    Column: column,
                    Field: field,
                    Operator: operator
                }

                parameters.push(row_parameter);
            });
//
//            $('[data-type="field-column"]:checked').each(function() {
//                columns.push($(this).val());
//            });

            $('.report_sorting_disabled').each(function() {
                columns.push({
                    Name: $(this).text(),
                    ValueType: $(this).attr('value-type'),
                    Value: $(this).attr('value'),
                    Width: $(this).css('width'),
                    Sort: $(this).attr('sort'),
                    Group: $(this).attr('group'),
                    Format: $(this).attr('format'),
                    ShowTotal: $(this).attr('show-total'),
                    ShowAverage: $(this).attr('show-average')
                });
            });


            //get plot bands
            $('.tr_plot_bands').each(function() {
                plotBands.push({
                    Name: $(this).find('td').eq(0).html(),
                    FromType: $(this).find('td').eq(1).html(),
                    From: $(this).find('td').eq(2).html(),
                    ToType: $(this).find('td').eq(3).html(),
                    To: $(this).find('td').eq(4).html(),
                    Color: $(this).find('td').eq(5).css('background-color')
                });
            });

            //symbols
            var symbol = {
                ValueType: $('[name="chart_symbol"]:checked').val(),
                Value: $('#symbol_value').val()
            }

            if (parameters.length == 0) {
                showNotification({
                    message: "Please add parameter.",
                    type: "error",
                    autoClose: true,
                    duration: 3
                });
                return;
            }
            if (columns.length == 0) {
                showNotification({
                    message: "Please add column.",
                    type: "error",
                    autoClose: true,
                    duration: 3
                });
                return;
            }

            $.post('/ajax/report',
                    {
                        report_id: report_id,
                        form_id: form_id,
                        title: title,
                        description: description,
                        parameters: JSON.stringify(parameters),
                        columns: JSON.stringify(columns),
                        plotBands: JSON.stringify(plotBands),
                        symbol: JSON.stringify(symbol),
                        yAxisMax: yAxisMax,
                        yAxisMin: yAxisMin,
                        yAxisInterval: yAxisInterval
                    }, function(data) {

                showNotification({
                    message: data,
                    type: "success",
                    autoClose: true,
                    duration: 3
                });

                $("#popup_overlay,#popup_container").remove();

                var t = setTimeout(function() {
                    window.location.reload();
                }, 3000);

            });
        });
    },
    setHeaderResizable: function() {
        $('.report_sorting_disabled').css({
            "min-width": "100px"
        });

        $('.report_sorting_disabled').resizable({
            ghost: true,
            handles: "e",
            stop: function(event, ui) {
                var originalWidth = ui.originalSize.width;
                var newWidth = ui.size.width;
                var width = parseFloat(ui.size.width) - parseFloat(ui.originalSize.width);

                var parentTable = $('#report_columns');
                var tableWidth = $(parentTable).css('width');
                var newTableWidth = parseFloat(tableWidth) + width;
                $(parentTable).css({
                    width: newTableWidth,
                    margin: 0
                });

            }
        });
    },
    getDetails: function() {
        var parameters = JSON.parse($('#parameters').val());
        var columns = JSON.parse($('#column-data').text());



        for (var index in columns) {
            $('.sortableRow').append('<th class="report_sorting_disabled" style="background: #EDEDED !important;" style="width:' + columns[index].Width + '" value-type="' + columns[index].ValueType
                    + '" value="' + columns[index].Value +
                    '" sort="' + columns[index].Sort +
                    '" group="' + columns[index].Group +
                    '" format = "' + columns[index].Format + 
                    '" show-total = "' + columns[index].ShowTotal + 
                    '" show-average = "' + columns[index].ShowAverage + '">' +
                    columns[index].Name +
                    '<div style="float:right"><i class="icon-remove delete_column"></i></div></th>');
        }

        if ($('#plot-bands-data').text() != '') {
            var plotBands = JSON.parse($('#plot-bands-data').text());

            for (var index in plotBands) {
                $('#report_chartPlotBands').append('<tr class="tr_plot_bands"><td>' + plotBands[index].Name + '</td><td>' + plotBands[index].FromType + '</td><td>' + plotBands[index].From + '</td><td>' + plotBands[index].ToType + '</td><td>' + plotBands[index].To + '</td><td style="background-color:' + plotBands[index].Color + '"></td><td style="text-align:center"><div class="icon-trash fa fa-trash-o cursor deletePlotBands" style="margin-left: auto;margin-right: auto" data-type="deactivate" data-user-id="1"></div></td></tr>');
            }
        }

        this.setHeaderResizable();


//  
//  
//        $('[data-type="field-column"]').each(function() {
//            var val = $(this).val();
//
//            if (columns.indexOf(val) > -1) {
//                $(this).attr('checked', true);
//            } else {
//                $(this).attr('checked', false);
//            }
//        });
    },
    setColumnProperties: function(obj) {
        var ret = "";
        ret += '<div style="float:left;width:50%;">';
        ret += '<h3 class="pull-left fl-margin-bottom">';
        ret += '<i class="icon-asterisk"></i> ' + "Column Properties";
        ret += '</h3>';
        ret += '</div>';
        ret += '<div class="hr"></div>';
        ret += '<div class="fields">';
        ret += '<div class="label_below2"> Name: </div>';
        ret += '<div class="input_position">';
        ret += '<input type="text" name="report_columnName" id="report_columnName" class="report_columnName form-text" value="">';
        ret += '</div>';
        ret += '</div>';
        ret += '<div class="fields">';
        ret += '<div class="label_below2"> Width: </div>';
        ret += '<div class="input_position">';
        ret += '<input type="text" name="report_columnWidth" id="report_columnWidth" class="report_columnWidth form-text" value="100px">';
        ret += '</div>';
        ret += '</div>';
        ret += '<div class="fields">';
        ret += '<div class="label_below2"> Type: </div>';
        ret += '<div class="input_position">';
        ret += '<select name="report_columnType" id="report_columnType" data-type="computed" class="form-select obj_prop" data-properties-type="lblFieldType" data-object-id="28"><option data-input-type="Text" value="Text">Text</option><option data-input-type="Currency" value="Currency">Currency</option><option data-input-type="Number" value="Number">Number</option></select>';
        ret += '</div>';
        ret += '</div>';
        ret += '<div class="fields formulaContainer">';
        ret += '<div class="label_below2">Value:</div>';
        ret += '<div class="input_position_below">';
        ret += '<label style="margin-bottom:10px; display:block; float:left;" class="fl-margin-right"><input id="value_static" data-properties-type="report_defaultValueType" class="formulaType css-checkbox" value="static" type="radio" checked="checked" name="report_defaultValueType" id="value_static"><label for="value_static" class="css-label"></label> Static </label>';
        ret += '<label style="margin-bottom:10px;"><input id="value_computed" data-properties-type="report_defaultValueType" class="formulaType css-checkbox" value="computed" type="radio" name="report_defaultValueType" id="value_computed"><label for="value_computed" class="css-label"></label> Computed </label>';
        ret += '<textarea data-type="textbox" class="form-textarea report_columnValue report-field-formula wfSettings" id="report_columnValue" data-properties-type="defaultValue" data-object-id="1" style="resize:vertical; margin:0px;"></textarea>';
        ret += '</div>';
        ret += '</div>';
        ret += '<div class="fields">';
        ret += '<div class="label_below2">Sort:</div>';
        ret += '<div class="input_position_below">';
        ret += '<label class="fl-margin-right"><input id="column_sort_none" data-properties-type="report_defaultValueType" class="css-checkbox" value="none" type="radio" checked="checked" name="report_column_sort"><label for="column_sort_none"class="css-label"></label> None </label>';
        ret += '<label class="fl-margin-right"><input id="column_sort_ascending" data-properties-type="report_defaultValueType" class="css-checkbox" value="ascending" type="radio" name="report_column_sort"><label for="column_sort_ascending"class="css-label"></label> Ascending </label>';
        ret += '<label><input id="column_sort_descending" data-properties-type="report_defaultValueType" class="css-checkbox" value="descending" type="radio" name="report_column_sort"><label for="column_sort_descending"class="css-label"></label> Descending </label>';
        ret += '</div>';
        ret += '</div>';
        ret += '<div class="fields groupings">';
        ret += '<div class="label_below2">Grouping:</div>';
        ret += '<div class="input_position_below">';
        ret += '<label class="fl-margin-right"><input id="column_group_none" data-properties-type="report_defaultValueType" class="css-checkbox" value="none" type="radio" checked="checked" name="report_column_grouping"><label for="column_group_none" class="css-label"></label> None</label>';
        ret += '<label class="fl-margin-right"><input id="column_group_categorized" data-properties-type="report_defaultValueType" class="css-checkbox" value="categorized" type="radio" name="report_column_grouping"><label for="column_group_categorized" class="css-label"></label> Categorized </label>';
        ret += '</div>';
        ret += '</div>';
        ret += '</div>';
        ret += '<div class="fields addDetails">';
        ret += '<div class="label_below2">Additional Details:</div>';
        ret += '<div class="input_position_below">';
        ret += '<label><input id="column_show_total" data-properties-type="report_defaultValueType" class="" type="checkbox" name="column_show_total">Show Total</label>';
        ret += '<label><input id="column_show_average" data-properties-type="report_defaultValueType" class="" type="checkbox" name="column_show_average">Show Average</label>';
        ret += '</div>';
        ret += '</div>';
        ret += '</div>';
        ret += '<div class="fields">';
        ret += '<div class="label_basic"></div>';
        ret += '<div class="input_position" style="margin-top:5px;text-align:right;">';
        ret += '<input type="button" class="btn-blueBtn reportColumnOK fl-margin-right" value="Ok"> ';
        ret += '<input type="button" class="btn-basicBtn" id="popup_cancel" value="Cancel">';
        ret += '</div>';
        ret += '</div>';

       var newDialog = new jDialog(ret, "", "", "", "", function() {
        });
       newDialog.themeDialog("modal2");
        

        if (obj) {
            var columnName = $(obj).text();
            var columnValueType = $(obj).attr('value-type');
            var columnValue = $(obj).attr('value');
            var columnSort = $(obj).attr('sort');
            var columnGroup = $(obj).attr('group');
            var columnWidth = $(obj).css('width');
            var columnType = $(obj).attr('format');
            var columnShowTotal = $(obj).attr('show-total');
            var columnShowAverage = $(obj).attr('show-average');


            $('#report_columnName').val(columnName);

            if (columnValueType == 'static') {
                $('#value_static').prop('checked', true);
            } else {
                $('#value_computed').prop('checked', true);
                $(".report-field-formula").mention_post({
                    json : formulaJson, // from local file fomula.json
                    highlightClass:"",
                    prefix : "",
                    countDisplayChoice : "4"
                });
            }

            switch (columnSort) {
                case "ascending":
                    $('#column_sort_ascending').prop('checked', true);
                    break;
                case "descending":
                    $('#column_sort_descending').prop('checked', true);
                    break;
                default :
                    $('#column_sort_none').prop('checked', true);
                    break;
            }

            switch (columnGroup) {
                case "categorized":
                    $('#column_group_categorized').prop('checked', true);
                    break;
                default:
                    $('#column_group_none').prop('checked', true);
                    break;
            }

            $('#report_columnValue').val(columnValue);
            $('#report_columnWidth').val(columnWidth);
            $('#report_columnType').val(columnType);


            if (columnShowTotal == 'true') {
                $('#column_show_total').prop('checked', columnShowTotal);
            }


            if (columnShowAverage == 'true') {
                $('#column_show_average').prop('checked', columnShowAverage);
            }



            var index = $('.sortableRow th').index(obj);
            $('.reportColumnOK').attr('column-index', index);

            if (index > 0) {
                $(obj).attr('group', '');
                $('.groupings').hide();
            }

            if (columnType == 'Text') {
                $('.addDetails').hide();
            }

        } else {
            var headerCount = $('.sortableRow th').length;
            if (headerCount > 0) {
                $('.groupings').hide();
            }

            $('.addDetails').hide();

        }
    },
    setChartPlotBand: function(obj) {
        var ret = "";
        ret += '<div style="float:left;width:50%;">';
        ret += '<h3 class="pull-left fl-margin-bottom">';
        ret += '<i class="icon-asterisk"></i> ' + "Plot Band";
        ret += '</h3>';
        ret += '</div>';
        ret += '<div class="hr"></div>';
        ret += '<div class="fields">';
        ret += '<div class="label_below2"> Name: </div>';
        ret += '<div class="input_position">';
        ret += '<input type="text" name="report_plotName" id="report_plotName" class="report_plotName form-text" value="">';
        ret += '</div>';
        ret += '</div>';
        ret += '<div class="fields">';
        ret += '<div class="label_below2">From:</div>';
        ret += '<div class="input_position_below">';
        ret += '<label class="fl-margin-right"><input id="plotFrom_static" data-properties-type="report_chartPlotBand_from" class="css-checkbox" value="static" type="radio" checked="checked" name="report_chartPlotBand_from"><label for="plotFrom_static" class="css-label"></label> Static </label>';
        ret += '<label class="fl-margin-right"><input id="plotFrom_computed" data-properties-type="report_chartPlotBand_from" class="css-checkbox" value="computed" type="radio" name="report_chartPlotBand_from"><label for="plotFrom_computed" class="css-label"></label> Computed </label>';
        ret += '<textarea data-type="textbox" class="form-textarea report_plotFromValue report-field-formula" id="report_plotFromValue" data-properties-type="defaultValue" data-object-id="1" style="resize:vertical; margin:0px;"></textarea>';
        ret += '</div>';
        ret += '</div>';
        ret += '<div class="fields">';
        ret += '<div class="label_below2">To:</div>';
        ret += '<div class="input_position_below">';
        ret += '<label class="fl-margin-right"><input id="plotTo_static" data-properties-type="report_chartPlotBand_to" class="css-checkbox" value="static" type="radio" checked="checked" name="report_chartPlotBand_to"><label for="plotTo_static" class="css-label"></label> Static </label>';
        ret += '<label class="fl-margin-right"><input id="plotTo_computed" data-properties-type="report_chartPlotBand_to" class="css-checkbox" value="computed" type="radio" name="report_chartPlotBand_to"><label for="plotTo_computed" class="css-label"></label> Computed </label>';
        ret += '<textarea data-type="textbox" class="form-textarea report_plotToValue report-field-formula" id="report_plotToValue" data-properties-type="defaultValue" data-object-id="1" style="resize:vertical; margin:0px;"></textarea>';
        ret += '</div>';
        ret += '</div>';
        ret += '<div class="label_below2">Color:</div>';
        ret += '<div class="input_position_below">';
        ret += '<input type="text" name="report_plotColor" id="report_plotColor" class="report_plotColor form-text" style="margin-top:5px;" value="">';
        ret += '</div>';
        ret += '</div>';
        ret += '<div class="fields">';
        ret += '<div class="label_basic"></div>';
        ret += '<div class="input_position" style="margin-top:5px;text-align:right;">';
        ret += '<input type="button" class="btn-blueBtn reportPlotBandOK fl-margin-right" value="Ok"> ';
        ret += '<input type="button" class="btn-basicBtn" id="popup_cancel" value="Cancel">';
        ret += '</div>';
        ret += '</div>';

       var newDialog = new jDialog(ret, "", "", "", "", function() {
        });
       newDialog.themeDialog("modal2");
        $(".report-field-formula").mention_post({
            json : formulaJson, // from local file fomula.json
            highlightClass:"",
            prefix : "",
            countDisplayChoice : "4"
        });
        var json_spectrum_settings = {
            color: "#ECC",
            showInput: true,
            className: "full-spectrum",
            showInitial: true,
            showPalette: true,
            showSelectionPalette: true,
            maxPaletteSize: 10,
            preferredFormat: "rgb",
            showAlpha: true,
            //localStorageKey: "spectrum.demo",
            move: function(color) {

            },
            show: function() {

            },
            beforeShow: function() {

            },
            hide: function() {

            },
            change: function() {

            },
            palette: [
                ["rgb(0, 0, 0)", "rgb(67, 67, 67)", "rgb(102, 102, 102)",
                    "rgb(204, 204, 204)", "rgb(217, 217, 217)", "rgb(255, 255, 255)"],
                ["rgb(152, 0, 0)", "rgb(255, 0, 0)", "rgb(255, 153, 0)", "rgb(255, 255, 0)", "rgb(0, 255, 0)",
                    "rgb(0, 255, 255)", "rgb(74, 134, 232)", "rgb(0, 0, 255)", "rgb(153, 0, 255)", "rgb(255, 0, 255)"],
                ["rgb(230, 184, 175)", "rgb(244, 204, 204)", "rgb(252, 229, 205)", "rgb(255, 242, 204)", "rgb(217, 234, 211)",
                    "rgb(208, 224, 227)", "rgb(201, 218, 248)", "rgb(207, 226, 243)", "rgb(217, 210, 233)", "rgb(234, 209, 220)",
                    "rgb(221, 126, 107)", "rgb(234, 153, 153)", "rgb(249, 203, 156)", "rgb(255, 229, 153)", "rgb(182, 215, 168)",
                    "rgb(162, 196, 201)", "rgb(164, 194, 244)", "rgb(159, 197, 232)", "rgb(180, 167, 214)", "rgb(213, 166, 189)",
                    "rgb(204, 65, 37)", "rgb(224, 102, 102)", "rgb(246, 178, 107)", "rgb(255, 217, 102)", "rgb(147, 196, 125)",
                    "rgb(118, 165, 175)", "rgb(109, 158, 235)", "rgb(111, 168, 220)", "rgb(142, 124, 195)", "rgb(194, 123, 160)",
                    "rgb(166, 28, 0)", "rgb(204, 0, 0)", "rgb(230, 145, 56)", "rgb(241, 194, 50)", "rgb(106, 168, 79)",
                    "rgb(69, 129, 142)", "rgb(60, 120, 216)", "rgb(61, 133, 198)", "rgb(103, 78, 167)", "rgb(166, 77, 121)",
                    "rgb(91, 15, 0)", "rgb(102, 0, 0)", "rgb(120, 63, 4)", "rgb(127, 96, 0)", "rgb(39, 78, 19)",
                    "rgb(12, 52, 61)", "rgb(28, 69, 135)", "rgb(7, 55, 99)", "rgb(32, 18, 77)", "rgb(76, 17, 48)"]
            ]
        }




        $('.report_plotColor').spectrum(json_spectrum_settings)

        if (obj) {

            console.log($(obj).find('td'))
            var name = $(obj).find('td')[0].textContent;
            var fromType = $(obj).find('td')[1].textContent;
            var from = $(obj).find('td')[2].textContent;
            var toType = $(obj).find('td')[3].textContent;
            var to = $(obj).find('td')[4].textContent;
            var color = $(obj).find('td').eq(5).css('background-color');

            console.log(name)
            $('#report_plotName').val(name);
            $('#report_plotFromValue').val(from);
            $('#report_plotToValue').val(to);
            $('#report_plotToValue').val(to);
            $('#report_plotColor').val(color);
            $('.report_plotColor').spectrum("set", color);

            if (fromType == 'static') {
                $('#plotFrom_static').prop('checked', true);
            } else {
                $('#plotFrom_computed').prop('checked', true);
            }
            if (toType == 'static') {
                $('#plotTo_static').prop('checked', true);
            } else {
                $('#plotTo_computed').prop('checked', true);
            }

            var index = $('#report_chartPlotBands tr').index(obj);
            $('.reportPlotBandOK').attr('row-index', index);
        }
    }
};

var parameters = {
    append: function(column, field, operator) {
        var active_fields = $('#active_fields').val();
        var arr = active_fields.split(',');

        var ret = '<tr data-type="tr_parameters"><td><input column="label" type="text" class="form-text"/></td>';
        ret += '<td><select column="field" class="form-select">';
        for (var index = 0; index <= arr.length - 1; index++) {
            ret += '<option value="' + arr[index] + '">' + arr[index] + '</option>';
        }
        ret += '</select></td>';
        ret += '<td><select column="operator" class="form-select">';
        ret += '<option value="=">Equal (==)</option>';
        ret += '<option value="<=">Less than equal (<=)</option>';
        ret += '<option value=">=">Greater than equal (>=)</option>';
        ret += '<option value=">">Greater than(>)</option>';
        ret += '<option value="<">Less than (<)</option>';
        ret += '<option value="!=">Not equal(!=)</option>';
        ret += '<option value="%">Contains(%)</option>';
        ret += '</select></td>';
        ret += '<td style="text-align: center;">';
        ret += '<div class="icon-trash fa fa-trash-o cursor deleteParameter" id="deleteUser_1" style="margin-left: auto;margin-right: auto" data-type="deactivate" data-user-id="1"></div>';
        ret += '</td>';

        $('[data="data-parameter"] tbody').eq(0).append(ret);
    },
    remove: function(self) {
        $(self).closest('tr').remove();
    }
}
$(document).ready(function() {
    report.init();
});


